import { Col, Form, Input, Row } from "antd";
import React, { useEffect } from "react";
// import { useLocation } from "react-router-dom";
import { RowElement } from "./tableSearchPanelConfig";
import styl from "./tableSearchPanel.module.scss"
const TableSearchPanel = (props) => {
    const {
        fields = [],
        onSearch = Function
    } = props

    const [form] = Form.useForm();
    const onFinish = (values) => {
        values = form.getFieldsValue()
        console.log("搜索参数：", values)
        onSearch(values)
    }

    // 页面地址变换了的时候重置表单
    // const location = useLocation();
    // useEffect(() => {
    //     form.resetFields();
    // }, [location.pathname])
    useEffect(() => {
        return () => {
            form.resetFields()
        }
    }, [])

    return (
        <div className={styl.tableScearchPanel} style={{ margin: "0 0 10px 0" }}>
            <Form
                form={form}
                onFinish={onFinish}
                name="searchPanelForm"
                className="ant-advanced-search-form"
            >

                <RowElement onFinish={onFinish} form={form} fields={fields} />
            </Form>
        </div>
    )

}

export default TableSearchPanel;